﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <meta http-equiv="cache-control" content="max-age=0" />
    <meta http-equiv="cache-control" content="no-cache" />
    <meta http-equiv="expires" content="0" />
    <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
    <meta http-equiv="pragma" content="no-cache" />

    <title>In Touch Reminder - Contact Details</title>

    <!-- stylesheets -->
    <link href="css/font.css" rel="stylesheet" type="text/css" />
    <link href="css/styles.css" rel="stylesheet" type="text/css" />
    <link href="css/plugins.css" rel="stylesheet" type="text/css" />
    <!-- end stylesheets -->

    <!-- general -->
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.11.min.js"></script>
    <script src="cordova.js" type="text/javascript" charset="utf-8"></script>
    <!-- end general -->

    <!--<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>-->


    <script type="text/javascript" src="js/plugins/forms/jquery.chosen.min.js"></script>
    <script type="text/javascript" src="js/plugins/forms/jquery.dualListBox.js"></script>
    <script type="text/javascript" src="js/plugins/ui/jquery.jgrowl.js"></script>
    <script type="text/javascript" src="js/files/bootstrap.js"></script>
    <script type="text/javascript" src="js/files/functions_simple.js"></script>
    <script type="text/javascript" src="js/plugins/moment.min.js"></script>


    <!-- application files -->
    <script type="text/javascript" src="js/app/globals.js"></script>
    <script type="text/javascript" src="js/app/dataServiceLocal.js"></script>
    <script type="text/javascript" src="js/app/deviceService.js"></script>
    <script type="text/javascript" src="js/app/phoneContactService.js"></script>
    <script type="text/javascript" src="js/app/contactDetails.js"></script>
    <!-- end application files -->

    <!-- common custom js -->
    <script type="text/javascript" src="js/custom.js"></script>
  

    <script type="text/javascript" charset="utf-8">
        
        //     // Wait for Cordova to load
        //    //
        //    document.addEventListener("deviceready", onDeviceReady, false);
       
        //// Cordova is ready
        ////
        //function onDeviceReady() {
        //    Page_ContactDetails.fn_init();
        //}

        Page_ContactDetails.fn_init();

      
    </script>

    <!-- stylesheet adjustments -->
    <style type="text/css">
        .glyph
        {
            display: inline-block;
            text-align: center;
            padding: .75em;
            margin: .75em 1em .75em 1em;
            width: 38px;
        }

        .fs1
        {
            font-size: 2em;
        }

        .widget [class*="icos-"]
        {
            float: none;
        }
        .tobewrap
        {
            white-space: pre;           /* CSS 2.0 */
	        white-space: pre-wrap;      /* CSS 2.1 */
	        white-space: pre-line;      /* CSS 3.0 */
	        white-space: -pre-wrap;     /* Opera 4-6 */
	        white-space: -o-pre-wrap;   /* Opera 7 */
	        white-space: -moz-pre-wrap; /* Mozilla */
	        white-space: -hp-pre-wrap;  /* HP Printers */
	        word-wrap: break-word;      /* IE 5+ */
        }
    </style>
    <!-- end stylesheet adjustments -->

</head>
<body>

    <!-- Top line begins -->
    <div id="top">
        <div class="topwrapper">
            <a href="contacts.html" class="backButton tipS" original-title="Back to List" id="A2"><span class="iconb" data-icon="&#xe0c0;"></span></a>
            <a href="contacts.html" title="" class="logo">
                <img src="images/logo.png" alt="" /></a>

            <!-- Right top nav -->
            <div class="topNav">
                <h2>
                    <span class="title" id="contactDetails_HeaderName">Contact Details</span></h2>
                <div class="clear"></div>
            </div>
        </div>
        <!-- Top line ends -->
    </div>
    <div class="modified_secNav">
        <!-- info block -->
        <div style="height: 60px;">
            <div style="text-align: center; margin-right: 12px">
                <img id="contactDetails_Pic" src="images/live/avatar_NoPic.png" alt="" />
            </div>
            
        </div>
        <div id="contact_methods" style="text-align: center">
            <ul id="contact_methods_list"></ul>
        </div>
        <div class="widget" style="margin-top: 20px; padding-bottom: 5px;">
            <div class="whead"><h6>General Info</h6><div class="clear"></div></div>
              <table cellpadding="0" cellspacing="0" width="100%" class="tDefault12" id="contactDetails_tbCategories">
                <tbody>
                    <tr>
                       <td  style="vertical-align: middle; width: 115px">
                            <span id="Span2" style="display: inline-block; margin-top: 5px;">
                              <strong>Categories:</strong>
                            </span>
                        </td>
                        <td style="vertical-align: middle">
                                <div class="formRow" style="padding: 5px 0 0 0;">
                                    <select name="select2" id="contactDetails_CategoryType" style="height: 25px; color:#858585 ">
                                        <option value=""></option>
                                        <option value="personal">Personal</option>
                                        <option value="business">Business</option>
                                    </select>
                               </div>
                        </td>
                        <td class="contactDetails_buttonCol">
                            <a href="#" class="tablectrl_medium bGreen tipS" original-title="Edit" id="btnSaveUpdateContactCategories"><span class="iconb" data-icon="&#xe097;"></span></a>
                        </td>
                    </tr>
                </tbody>
            </table>
            <table cellpadding="0" cellspacing="0" width="100%" class="tDefault12">
                <!--<thead>
                    <tr>
                        <td></td>
                        <td></td>
                    </tr>
                </thead>-->
                <tbody>
                    <tr>
                       <td style="vertical-align: middle; width: 115px">
                           <strong>Last Contacted:</strong>
                       </td>
                       <td style="vertical-align: middle">
                            <span id="contactDetails_lastcontated">
                            </span>
                        </td>
                        <td class="contactDetails_buttonCol" >
                            <a href="#" class="tablectrl_medium bRed tipS" original-title="Remove" id="btnResetLastContacted"><span class="iconb" data-icon="&#xe021;"></span></a>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
        
        <div class="widget" style="margin-top: 20px; padding-bottom: 5px;">
            <div class="whead"><h6>Contact Info</h6><div class="clear"></div></div>
            <table cellpadding="0" cellspacing="0" width="100%" class="tDefault12" id="trContactInfos">
                <!--<thead>
                    <tr>
                        <td></td>
                        <td></td>
                    </tr>
                </thead>-->
                <!--<tbody id="trContactInfos">
                    
                </tbody>-->
            </table>
        </div>
        <div class="widget" style="margin-top: 20px; padding-bottom: 5px;">
            <div class="whead"><h6>Reminders</h6><div class="clear"></div></div>
            <table cellpadding="0" cellspacing="0" width="100%" class="tDefault12" id="tbReminderEdit">
                <!--<thead>
                    <tr>
                        <td></td>
                        <td></td>
                    </tr>
                </thead>-->
                <tbody>
                    <tr>
                       <td  style="vertical-align: middle"">
                            <span id="Span1">
                              <strong>Remind Me In:</strong>
                            </span>
                        </td>
                        <td style="vertical-align: middle">
                            <!--<div class="grid9 noSearch">-->
                                <div class="formRow" style="padding: 5px 0 0 0;">
                                    <input type="text" id="contactDetails_ReminderNum" maxlength="2" style="width: 40px; font-size: 1em" />
                                    <select name="select2" id="contactDetails_ReminderPeriod" style="height: 25px; color:#858585 ">
                                        <option value="minutes">Minutes</option>
                                        <option value="hours">Hour(s)</option>
                                        <option value="days">Days (s)</option>
                                        <option value="weeks">Week (s)</option>
                                        <option value="months">Month (s)</option>
                                        <option value="years">Year</option>
                                    </select>
                               </div>

                            <!-- </div>-->
                        </td>
                        <td  class="contactDetails_buttonCol">
                            <a href="#" class="tablectrl_medium bGreen tipS" original-title="Edit" id="btnSaveUpdateReminders"><span class="iconb" data-icon="&#xe097;"></span></a>
                        </td>
                    </tr>
                </tbody>
            </table>
             <table cellpadding="0" cellspacing="0" width="100%" class="tDefault12" id="tbReminderLabel">
                <!--<thead>
                    <tr>
                        <td></td>
                        <td></td>
                    </tr>
                </thead>-->
                <tbody>
                    <tr>
                       <td style="vertical-align: middle">
                           <strong>Reminder Set For:</strong>
                       </td>
                       <td style="vertical-align: middle">
                            <span id="contactDetails_lblReminderSetFor">
                            </span>
                        </td>
                        <td class="contactDetails_buttonCol" >
                            <a href="#" class="tablectrl_medium bRed tipS" id="contactDetails_buttonRemoveReminder"><span class="iconb" data-icon="&#xe20e;"></span></a>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>

    <script type="text/javascript">
        $("#btnResetLastContacted").click(function () {
            if (window.confirm('Reset Last Contacted Date?')) {
                Page_ContactDetails.fn_ResetLastContacted('phone');
            }

        });

        $("#btnSaveUpdateReminders").click(function () {
            //Save the Reminders
            Page_ContactDetails.fn_Reminders_SaveUpdate();
        });
        
        
        $("#btnSaveUpdateContactCategories").click(function () {
            //Save the Reminders
            Page_ContactDetails.fn_ContactCategories_SaveUpdate();
        });

        ////window.setInterval(
        ////    function () {
        ////        //refresh the timing functionalities
        ////        Page_ContactDetails.fn_Refresh_Timed_Areas();
        ////    }, 60000);
    </script>
</body>
</html>
